<template>
  <div class="orderdetail_product">
    <div>
      <div class="shop">
        <div>南阳国际</div>
        <div>由<span>西安大都会店</span>配送</div>
      </div>
      <van-icon name="phone-o" size="30" color="#a7d500" />
    </div>
    <div class="product_line"></div>
    <van-card
      num="1"
      price="19.00"
      desc="冷"
      title="乌龙冷泡"
      thumb="/downloadFile/59.jpeg"
      style="padding: 0"
    />
  </div>
</template>

<script>
import PayCard from "../components/PayCard.vue";
import ShopCard from "../components/ShopCard.vue";
export default {
  components: { PayCard, ShopCard },
};
</script>

<style scoped>
.orderdetail_product {
  background-color: #fff;
  width: 100%;
  margin: 2vw auto;
  padding: 4vw;
  border-radius: 2vw;
  box-sizing: border-box;
}
.orderdetail_product > div {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.orderdetail_product .shop > div:nth-child(1) {
  font-size: 16px;
  font-weight: bold;
  line-height: 6vw;
}
.orderdetail_product .shop > div:nth-child(2) {
  font-size: 12px;
}
.orderdetail_product .shop > div:nth-child(2) span {
  color: #a7d500;
}

.orderdetail_product .product_line {
  margin-top: 4vw;
  width: 92%;
  margin: 4vw auto 0;
  border-bottom: 1px dashed gainsboro;
  position: relative;
}
.orderdetail_product .product_line::after,
.orderdetail_product .product_line::before {
  content: "";
  display: block;
  width: 4vw;
  height: 4vw;
  border-radius: 50%;
  background-color: #f3f4f5;
  position: absolute;
}
.orderdetail_product .product_line::after {
  left: -12%;
}
.orderdetail_product .product_line::before {
  right: -12%;
}
::v-deep .orderdetail .vant-card {
  width: 100% !important;
  background-color: white;
  /* padding: 0px!important; */
}
.orderdetail_product .van-card {
  background-color: white;
}
.orderdetail_product .van-card__header {
  width: 100%;
}
.orderdetail_product .van-card__content {
  min-height: 14vw !important;
}
.orderdetail_product .van-card__thumb {
  margin-right: 8vw;
  width: 14vw;
  height: 14vw;
}
</style>

